<template>
	<view class="Receipt">
		<image class="flag" v-if="entity.IsConfirm == 1" src="/static/stateIcon/yiqueren.png" mode="">
		</image>
		<image class="flag" v-else-if="entity.IsConfirm == 2" src="/static/stateIcon/yidahui.png" mode=""></image>
		<image class="flag" v-else src="/static/stateIcon/daiqueren.png" mode=""></image>
		<view class="container">
			<view class="h3">{{ entity.CompanyName }}</view>
			<view class="cell"><text>单号:</text>{{getReplaceId("S"+entity.Id)}}</view>
			<view class="cell">
				<text>日期:</text>{{ entity.CreateTime?entity.CreateTime.substring(0, 19):'' }}
			</view>
			<view class="cell"><text>客户:</text>{{ entity.RealName||'散客' }}</view>
			<!-- <view class="cell"><text>客户地址:</text>{{ entity.cCusAddress||'' }}</view>
			<view class="cell"><text>客户电话:</text>{{ entity.cCusPhone||'' }}</view> -->
			<view class="tableRow" style="border-bottom: 1px dashed #ccc; margin-top: 10px; line-height: 2">
				<text class="tableIndex"></text>
				<text class="tableCol left">品名/编码</text>
				<text class="tableCol">数量</text>
				<text class="tableCol">单价</text>
				<text class="tableCol">金额</text>
			</view>
			<view style="padding: 10px 0">
				<view v-for="(item, index) in data" :key="index">
					<view class="tableRow">
						<text class="tableIndex">{{ index + 1 }}</text>
						<text class="tableCol left">{{ item.InventName }}</text>
						<text class="tableCol">{{ item.Quantity }}</text>
						<!-- <text class="tableCol">{{ item.GroupName }}</text> -->
						<text class="tableCol">{{ momenyFormat(item.Price) }}</text>
						<text class="tableCol">{{ momenyFormat(item.Money) }}</text>
					</view>
					<view class="tableRow">
						<text class="tableIndex"></text>
						<text class="tableCol left">{{ item.cInvCode||'' }}</text>
						<text class="tableCol">{{ item.GroupName||'' }}</text>
						<text class="tableCol col2">规格: {{ item.cInvStd||'' }}</text>
						<!-- <text class="tableCol">{{ item.GroupName }}</text> -->
					</view>
				</view>
			</view>

			<view class="tableRow" style="border-top: 1px dashed #ccc; line-height: 2; margin-bottom: 10px">
				<text class="tableIndex"></text>
				<text class="tableCol left">合计</text>
				<text class="tableCol">{{ entity.CreditNum }}</text>
				<text class="tableCol"></text>
				<text class="tableCol" style="">{{ momenyFormat(entity.CreditAmount) }}</text>
			</view>
		</view>
		<view class="height:66px">

		</view>
		<view class="fixedBtnGroup" v-if="entity.IsConfirm==0" :style="{opacity:disabled==true?0.5:1}"> 
			<button :disabled="disabled" type="warn" @click="approve(2)">拒单</button>
			<button :disabled="disabled" type="primary" @click="approve(1)">确认</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				disabled:false,
				Id: "",
				entity: {},
				data: [],
				type: '',
				Id: ''
			}
		},
		onLoad(options) {
			this.Id = options.Id
			this.getTheData(options.Id)
		},
		onBackPress() {
			return
		},
		methods: {
			// 字符串空格处理
			getReplaceId(data) {
				if (data) {
					return data.replace(/\s/g, '').replace(/(.{4})/g, "$1 ")
				}
			},
			// 获取小票列表数据和单号相关信息
			getTheData(Id) {
				this.$http('post', "/BO/ApplicationForm/GetApplicationDetail?id=" + Id).then((res) => {
					console.log(res);
					if (res.Success) {
						this.data = res.Data.details;
						this.entity = res.Data;
					} else this.$message.error(res.Msg);
				});
			},
			momenyFormat(num) {
				num = Number(num)
				if (isNaN(num)) return '0.00'
				return num.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,')
			},
			approve(bl) {
				console.log('打印单价', this.data)
				uni.showModal({
					title: '提示',
					content: '您确定要' + (bl == 1 ? '确认' : '拒单') + '吗?',
					success: (val) => {
						if (val.cancel) return
						// 金庸按鈕  防止頻繁點擊
						this.disabled=true
						uni.showLoading({
							title: '加载中'
						})
						this.$http('post', '/BO/ApplicationForm/ConfirmApplicationForm', {
							"Id": this.Id,
							"IsConfirm": bl
						}).then(res => {
							if (res.Success) {
								if (bl == 1) {
									this.getAppDataByLocationapp(res.Data)
								}else{
									
									setTimeout(function() {
										uni.showToast({
											title:'已拒单'
										})
										uni.navigateBack()
										uni.hideLoading()
									}, 2000)
								}
								
							} else {
								uni.hideLoading()
								this.$api.msg(res.Msg)
							}
						})
					},
				})
			},
			// 回执单生成
			getAppDataByLocationapp(Billid) {
				uni.showLoading({
					title: '回执单生成中'
				})
				var that = this
				let newData = this.data
				// 总重量
				let Weight1 = 0
				// 产品总额
				let SumiInvRCost = 0
				newData.forEach(item => {
					// 总重处理
					Weight1 += (item.Quantity * item.Weight)
					item.Weight1 = Weight1
					// 产品总额处理
					SumiInvRCost += (item.Price * item.Quantity)
					item.SumiInvRCost = SumiInvRCost
					item.Name = item.InventName ? item.InventName : ''
					item.Weight = item.Weight ? item.Weight : 0
					item.GroupName = item.GroupName ? item.GroupName : ''
					item.iInvRCost = item.Price ? item.Price : 0
					item.cInvCode = item.cInvCode ? item.cInvCode : 0
				})
				// 最终传递的回执单参数
				var byLocationData = {
					Billid: Billid,
					CustomerId: this.entity.CompanyId + '-' + this.entity.BuyerStoreId,
					// 公司id
					Company: this.entity.CompanyId,
					// 买家店铺id
					BuyerStoreId: this.entity.BuyerStoreId,
					// 买家手机号
					CustomerPhone: this.entity.BuyerStorePhone,
					DomainName: "hzq",
					Content: JSON.stringify({
						BillId: Billid,
						Customer: this.entity.RealName,
						Subs: JSON.stringify(newData)
					})
				}
				console.log('生成回执单', byLocationData)
				this.$http('post', '/BO/BillList/AppDataByLocation', byLocationData).then(res => {
					if (res.Success) {
						if (res.Data) {
							setTimeout(function() {
								uni.navigateBack()
								uni.hideLoading()
							}, 2000)
							
						}
					} else {
						uni.hideLoading()
						that.$api.msg(res.Msg)
					}
				})


			},
		}
	}
</script>

<style lang="scss" scoped>
	.fixedBtnGroup {
		position: fixed;
		width: 100%;
		left: 0;
		bottom: 0;
		display: flex;
		background-color: #f8f8f8;

		button {
			flex: 1;
			margin: 10px;
		}
	}

	.tag {
		position: absolute;
		right: 10px;
		top: 10px;
		border: 1px solid red;
		height: 50px;
		width: 50px;
		line-height: 50px;
		text-align: center;
		border-radius: 50%;
		color: red;
		transform: rotate(-20deg);
	}

	.edit_view {
		overflow: hidden;
	}

	.btn_view {
		overflow: hidden;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 60px;
		border-top: 1px solid #ccc;
		background: #fff;
		z-index: 9999;
	}

	.btn_edit {
		float: right;
		margin-top: 7px;
		margin-left: 8px;
		margin-right: 8px;
		width: 100px;
	}

	.btn_submit {
		float: right;
		width: 100px;
		margin-top: 7px;
		background-color: #438FE8;
	}

	.btn_add {
		margin-bottom: 4px;
		height: 30px;
		font-size: 16px;
		line-height: 30px;
	}

	.Receipt {
		position: relative;

		.flag {
			position: absolute;
			right: 0;
			top: 0;
			width: 50px;
			height: 50px;
		}

		.imgBox {
			display: flex;
			align-items: center;
			justify-content: center;
			height: 180px;
			overflow: hidden;
			width: 100%;
			background-color: #fff;

			.img {
				transform: rotate(-90deg);
				width: 160px;
				background-color: #fff;
			}
		}

		.txt {
			margin-top: 10px;
			text-align: center;
		}

		.container {
			margin: 0 auto;
			color: #000;
			padding: 10px 40rpx;

			.h3 {
				text-align: center;
				font-weight: bold;
			}

			.cell {
				display: flex;
				line-height: 2;

				span {
					width: 40px;
				}
			}

			.tableRow {
				font-size: 12px;
				display: flex;
				align-items: center;

				span {
					overflow: hidden;
				}

				.tableCol {
					// flex: 1;
					width: 75px;
					text-align: right;
					overflow: hidden;
				}

				.tableInp {
					font-size: 12px;
					width: 75px;
					text-align: right;
					overflow: hidden;
					border: 1px solid #ccc;
					padding: 4px;
					border-radius: 4px;
				}

				.left {
					text-align: left;
					flex: 1;
				}

				.tableIndex {
					width: 25px;
				}

				.col2 {
					width: 150px;
				}
			}
		}
	}
</style>